<template>
	<div class="container">
		<div class="tr">
			<el-button type="primary" class="time_btn"
				><i class="iconfont">&#xe678; </i>下载采集工具</el-button
			>
			<el-button type="primary" class="time_btn"
				><i class="iconfont">&#xe676; </i>新增采集任务</el-button
			>
		</div>

		<my-table
			:table-data="tableData"
			:col-configs="colConfigs"
			:list-loading="listLoading"
			:total="total"
			:page-size="listQuery.pagesize"
			:isExpand="true"
			:isExpandOne="true"
			@refreshList="getList"
		>
			<el-table-column label="操作" slot="opt" width="320px">
				<template slot-scope="{ row }">
					<el-button size="small">小型按钮</el-button>
					<el-button type="primary" class="time_btn" @click="handleChange(row)"
						>修改</el-button
					>
					<!-- <el-button type="primary" class="time_btn" @click="handleChange(row)">禁用</el-button> -->

					<el-button type="primary" class="time_btn" @click="handleChange(row)"
						>启用</el-button
					>
					<el-button type="primary" class="time_btn" @click="handleChange(row)"
						>删除</el-button
					>
					<el-button type="primary" class="time_btn" @click="handleChange(row)"
						>重启</el-button
					>
				</template>
			</el-table-column>
			<el-table-column label="状态" slot="status">
				<template slot-scope="{ row }">
					<span v-if="row.status === 0">已申请</span>
					<span v-if="row.status === 1">已通过</span>
					<span v-if="row.status === 2">已拒绝</span>
					<span v-if="row.status === 3">已解约</span>
				</template>
			</el-table-column>
			<!--展开的列表-->
			<template slot="expand">
				<my-table
					:table-data="tableData2"
					:col-configs="colConfigs2"
					:list-loading="listLoading"
					:total="total2"
					:page-size="listQuery.pagesize"
					@refreshList="getDetailList"
				>
					<el-table-column slot="opt" label="操作" width="120px">
						<template slot-scope="{ row }">
							<span class="iconfont col-0A70B0">&#xe679;</span>
						</template>
					</el-table-column>
				</my-table>
			</template>
		</my-table>
	</div>
</template>

<script>
import myTable from 'components/myTable'
import { getMsgList } from '@/api/visit-mg'
export default {
	name: 'MsgManger',
	components: { myTable },
	data () {
		return {
			listQuery: {
				pagesize: 10,
				pageindex: 1,
				timeVal: [],
			},
			colConfigs: [
				{
					type: 'index',
					label: '序号',
					width: '50px'
				},
				{
					prop: 'share_user',
					label: '采集名称',
					sortable: false,
				},
				{ slot: 'opt' },
				{
					prop: 'initiate_user',
					label: '服务唯一号',
					sortable: false,
				},
				{
					prop: 'create_user_name',
					label: '创建人',
					sortable: false,
				},
				{
					prop: 'client_host',
					label: '主机名',
					sortable: false,
				},
				{
					prop: 'create_time',
					label: '创建时间',
					sortable: false,
					width: 200
				},
				{
					prop: 'start_date',
					label: '启动时间',
					sortable: false,
					width: 200
				},
				{
					prop: 'client_host',
					label: '运行标志',
					sortable: false,
				}
			],
			tableData: [
				{
					hospital_name: '第一医院',
					share_user: '王浩然',
					status: 0,
					create_user_name: '王麻子医生',
					create_time: '2020-12-25 12:25:20',
					start_date: '2020-12-25 12:25:20',
				},
				{
					hospital_name: '第一1医院',
					share_user: '王浩然',
					status: 3,
					create_user_name: '王麻子医生',
					create_time: '2020-12-25 12:25:20',
					start_date: '2020-12-25 12:25:20',
				},
				{
					hospital_name: '第一1医院',
					share_user: '王浩然',
					status: 0,
					create_user_name: '王麻子医生',
					create_time: '2020-12-25 12:25:20',
					start_date: '2020-12-25 12:25:20',
				},
				{
					hospital_name: '第一医院1',
					share_user: '王浩然',
					status: 1,
					create_user_name: '王麻子医生',
					create_time: '2020-12-25 12:25:20',
					start_date: '2020-12-25 12:25:20',
				},
				{
					hospital_name: '第一医院222',
					status: 2,
					create_user_name: '王麻子医生',
					create_time: '2020-12-25 12:25:20',
					start_date: '2020-12-25 12:25:20',
				},
			],
			total: 0,
			colConfigs2: [
				{
					type: 'index',
					label: '序号',
				},
				{
					prop: 'patient_name',
					label: '姓名',
					sortable: false,
				},
				{
					prop: 'accession_number',
					label: '检查号',
					sortable: false,
				},
				{
					prop: 'med_rec_no',
					label: '病历号',
					sortable: false,
				},
				{
					prop: 'patient_id',
					label: '患者编号',
					sortable: false,
				},
				{
					prop: 'perform_dept',
					label: '检查科室',
					sortable: false,
				},
				{
					prop: 'exam_type',
					label: '检查类型',
					sortable: false,
				},
				{
					prop: 'perform_time',
					label: '检查时间',
					sortable: false,
				},
			],
			tableData2: [
				{
					hospital_name: '第一医院',
					share_user: '王浩然',
					patient_id: '0252525W25',
					share_doctor: '王麻子医生',
				},
				{
					hospital_name: '第一1医院',
					share_user: '王浩然',
					patient_id: '3252525W25',
					share_doctor: '王麻子医生',
				},
				{
					hospital_name: '第一1医院',
					share_user: '王浩然',
					patient_id: '0252525W25',
					share_doctor: '王麻子医生',
				},
				{
					hospital_name: '第一医院1',
					share_user: '王浩然',
					patient_id: '1252525W25',
					share_doctor: '王麻子医生',
				},
				{
					hospital_name: '第一医院222',
					patient_id: '2252525W25',
					share_doctor: '王麻子医生',
				},
			],
			total2: 0,
			listLoading: false,
			activeName: 'first',
		}
	},
	computed: {},
	created () { },
	mounted () {
		// this.getList()
	},
	methods: {
		getList ( val ) {

      /*
       * h获取任务统计
       * TODO
       */
			delete this.listQuery.timeVal
			const params = Object.assign( this.listQuery, val )
			console.log( params )
			getMsgList( params ).then( res => {
				if ( res.code === 0 ) {
					this.tableData = res.data.listQuery
					this.total = res.data.total
				}
			} )
		},
		getDetailList () {
			// 获取详情
		},
		handleRefresh () {
			this.getList()
		},
		handleReset ( searchForm ) {
			// 表单重置
			this.$nextTick( () => {
				this.$refs.searchForm.resetFields()
			} )
		},
		handleClick () {
			console.log( this.activeName )
			if ( this.activeName === 'first' ) {
				// 我的申请
			} else {
				// 我的授权
			}
		},
	},
}
</script>

<style scoped lang="less">
.container {
	padding: 0 10px;
	.btns {
		margin-bottom: 20px;
	}
	.el-input__inner {
		width: 13.7vw;
	}
}
</style>
